import { defineStore } from 'pinia'
import { ref, computed } from 'vue'

export const useConfigStore = defineStore('config', () => {
  // 状态
  const appConfig = ref({
    apiBaseUrl: 'http://localhost:3000',
    recordingServerUrl: 'http://localhost:3001',
    autoSave: true,
    autoSaveInterval: 30000, // 30秒
    theme: 'light',
    language: 'zh-CN'
  })

  const uiConfig = ref({
    showLineNumbers: true,
    showStepIcons: true,
    showExecutionTime: true,
    compactMode: false,
    splitPanelRatio: 0.4 // 左侧面板占比
  })

  const recordingDefaults = ref({
    width: 1280,
    height: 720,
    device: 'desktop',
    headless: false,
    timeout: 30000,
    waitForLoadState: 'domcontentloaded'
  })

  const executionDefaults = ref({
    timeout: 30000,
    retryCount: 3,
    continueOnError: false,
    headless: true,
    slowMo: 0,
    screenshot: 'only-on-failure'
  })

  // 计算属性
  const isDarkMode = computed(() => appConfig.value.theme === 'dark')
  const isAutoSaveEnabled = computed(() => appConfig.value.autoSave)

  // 方法
  function setAppConfig(config) {
    appConfig.value = { ...appConfig.value, ...config }
    saveConfig()
  }

  function setUiConfig(config) {
    uiConfig.value = { ...uiConfig.value, ...config }
    saveConfig()
  }

  function setRecordingDefaults(config) {
    recordingDefaults.value = { ...recordingDefaults.value, ...config }
    saveConfig()
  }

  function setExecutionDefaults(config) {
    executionDefaults.value = { ...executionDefaults.value, ...config }
    saveConfig()
  }

  function toggleTheme() {
    appConfig.value.theme = appConfig.value.theme === 'light' ? 'dark' : 'light'
    saveConfig()
  }

  function toggleAutoSave() {
    appConfig.value.autoSave = !appConfig.value.autoSave
    saveConfig()
  }

  function resetToDefaults() {
    appConfig.value = {
      apiBaseUrl: 'http://localhost:3000',
      recordingServerUrl: 'http://localhost:3001',
      autoSave: true,
      autoSaveInterval: 30000,
      theme: 'light',
      language: 'zh-CN'
    }

    uiConfig.value = {
      showLineNumbers: true,
      showStepIcons: true,
      showExecutionTime: true,
      compactMode: false,
      splitPanelRatio: 0.4
    }

    recordingDefaults.value = {
      width: 1280,
      height: 720,
      device: 'desktop',
      headless: false,
      timeout: 30000,
      waitForLoadState: 'domcontentloaded'
    }

    executionDefaults.value = {
      timeout: 30000,
      retryCount: 3,
      continueOnError: false,
      headless: true,
      slowMo: 0,
      screenshot: 'only-on-failure'
    }

    saveConfig()
  }

  function loadConfig() {
    try {
      const saved = localStorage.getItem('slyt-config')
      if (saved) {
        const config = JSON.parse(saved)
        if (config.appConfig) appConfig.value = { ...appConfig.value, ...config.appConfig }
        if (config.uiConfig) uiConfig.value = { ...uiConfig.value, ...config.uiConfig }
        if (config.recordingDefaults) recordingDefaults.value = { ...recordingDefaults.value, ...config.recordingDefaults }
        if (config.executionDefaults) executionDefaults.value = { ...executionDefaults.value, ...config.executionDefaults }
      }
    } catch (error) {
      console.warn('Failed to load config from localStorage:', error)
    }
  }

  function saveConfig() {
    try {
      const config = {
        appConfig: appConfig.value,
        uiConfig: uiConfig.value,
        recordingDefaults: recordingDefaults.value,
        executionDefaults: executionDefaults.value
      }
      localStorage.setItem('slyt-config', JSON.stringify(config))
    } catch (error) {
      console.warn('Failed to save config to localStorage:', error)
    }
  }

  // 初始化时加载配置
  loadConfig()

  return {
    // 状态
    appConfig,
    uiConfig,
    recordingDefaults,
    executionDefaults,
    // 计算属性
    isDarkMode,
    isAutoSaveEnabled,
    // 方法
    setAppConfig,
    setUiConfig,
    setRecordingDefaults,
    setExecutionDefaults,
    toggleTheme,
    toggleAutoSave,
    resetToDefaults,
    loadConfig,
    saveConfig
  }
})

